홈페이지를 빌드할 때 layout은 상당히 중요한 요소입니다. 특히 모바일 및 태블릿 환경을 고려해야 하기 때문에 더욱 신경 쓸 수 밖에 없는데요... float 속성을 사용하면 layout 간의 빈 여백을 없도록 도와줍니다.
Example
<style>
float: left;
float: right;
</style>
위처럼 float 속성을 사용한 뒤 다음 레이어는 위에서 미리 선언된 레이들과 연관없이 처음부터 float 선언하고 싶을 때... 이 때 사용하는 속성이 clear속성입니다... 말이 다소 어려운데 clear 속성을 사용하면 선언된 레이어는 미리 선언된 float속성을 무시하고 새로 float가 선언된 것처럼 그 아래에 위치시킵니다... 간단하게, 리셋시킨다고 생각하시면 됩니다.
Example
<style>
clear: left;
clear: right;
clear: both;
</style>
만약, 위에 선언된 float값이 left라면 clear:left를 ... right라면 clear:right를 사용하면 됩니다...둘 다 사용되었으면 clear: both를 쓰면 돱니다.